const app = new Vue({
  el: "#app",
  data:{
    books:[
      {
        id: 1,
        name: "算法",
        date: "2006-9",
        price: 85.00,
        count: 1
      },
      {
        id: 2,
        name: "unix",
        date: "2020-9",
        price: 59.00,
        count: 1
      },
      {
        id: 3,
        name: "编程",
        date: "2016-9",
        price: 39.00,
        count: 1
      },
    ]
  },
  methods: {
    getFinalPrice(price){
      return "¥"+price.toFixed(2);
    },
    increment(index){
      this.books[index].count++;
    },
    decrement(index){
      this.books[index].count--;
    },
    removeBtnClick(index){
      this.books.splice(index,1);
    }
  },
  computed: {
    totalPrice(){
      let total = 0;
      // 1. 普通的for循环
      // for(let i=0; i<this.books.length; i++){
      //   total += this.books[i].price*this.books[i].count;
      // }
      // return total;

      // 2. for (let i in this.books)
      // for(let i in this.books){
      //   // console.log(i);  // index  0, 1, 2
      //   total += this.books[i].price*this.books[i].count;
      // }
      // return total;

      // 3. of
      // for(let item of this.books){
      //   // console.log(i);  // index  0, 1, 2
      //   total += item.price*item.count;
      // }
      // return total;

      // 4. reduce
      return this.books.reduce(function(preValue, book){
        return preValue+book.price*book.count;
      }, 0);
      }
  },
  filters: {
    showPrice(price){
      return "¥"+price.toFixed(2);
    }
  }
});

// 编程范式：命令式编程，声明式编程
// 面向对象编程（第一公民：对象）/函数式编程（第一公民：函数）

// filter/map/reduce


const nums = [10, 20, 111, 222, 444, 40, 50];

// 简单写法
let total = nums.filter(n => n<100).map(n=>n*2).reduce((pre, n)=>pre+n);
console.log(total);

// 链式写法
// let total = nums.filter(function(n){
//   return n<100;
// }).map(function(n){
//   return n*2;
// }).reduce(function(preValue, n){
//   return preValue+n;
// }, 0)
// console.log(total);
// 1. filter中的回调函数有一个要求，必须返回一个Boolean值
// true：当返回true时，函数内部会自动将这次回调的n加入到新的数组中
// false：当返回false时，函数内部会过滤掉这次的n。
// let newNums = nums.filter(function(n){
//   return n<100;
// });
// console.log(newNums);

// // 2. map 
// // 20 40 80 100
// let new2Nums = newNums.map(function(n){
//   return n*2;
// })
// console.log(new2Nums);

// // 3. reduce
// // 对数组中所有的内容进行汇总
// let total = new2Nums.reduce(function(preValue, n){
//   return preValue+n;
// }, 0);
// console.log(total);
// 第一次：preValue:0, n:20
// 第二次：preValue:100, n:40
// 第三次：preValue:0, n:80
// 第四次：preValue:0, n:100


// // 1. 需求：取出所有小于100的数字
// let newNumbs = [];
// for(let n of nums){
//   if(n<100){
//     newNumbs.push(n);
//   }
// }
// // 2. 将所有小于100的数字进行转化：全部*2
// let new2Nums = []
// for(let n  of newNumbs){
//   new2Nums.push(n*2);
// }
// console.log(new2Nums);

// // 3. 需求：将所有new2Nums数字相加，得到最终的结果
// let total = 0;
// for(let n of new2Nums){
//   total += n;
// }
// console.log(total);

